<?php
/**
 * custom walker class
 * 
	 * 总结： 
	 * first,use the start lvl function to change the css class of the submenu ul class 
	 * then use start el function to add a new css class 'dropdown ' to the menu li item which containes the sub menu level
	 * and add the class to the link submenu item  which means add the 'dropdown-toggle' class to the link belongs to the li 
	 * use the start_el function again to add the span after the a link </a> which has the sub menu level 
	 * 
	 * 
 */

 class Ha_Menu_Walker_Class extends Walker_Nav_Menu {

	//start lv1 ,  start lv1 是一级菜单，也就是depth = 0 , 也就是1级菜单开始的ul 
	//start lvl 是generate the open ul of the nav menu 
	//2级菜单开始  也是start lv1 开始，但是进入到了depth =1 层级 
	//用start lvl 函数来改变子级菜单的ul的class 
	//start lvl 函数改写的是二级菜单的ul ,， 一级菜单的ul已经写进了 wp_nav_menu里面

	function start_lvl(&$output,$depth = 0 ,$args = array()) {

		//START LVL 函数是修改子级菜单ul的class的 
		//add the indent when menu first lvl 
		$indent = str_repeat("\t", $depth);
		//check if the menu contains the submenu adds the class on submenu ul
		//submenu 是三级菜单的ul 
		$submenu = ($depth > 0) ? ' sub-menu' : ''; 
		//use .= to expand the menu output if theere is submenu enter a new line 如果菜单高过两级添加ul的sub-menu 
		$output .= "\n$indent<ul class=\"dropdown-box$submenu depth-$depth\">\n";

	}

	//start el  是每个1级菜单下面开始的li，是一个循环，一级菜单li元素的循环
	//start el 是generate the open li element of the wordpress 
	//example: start el <li><a>Home</a> end el</li>

	function start_el(&$output, $item, $depth = 0, $args = NULL, $id = 0) {
		//$item是当前的element 也就是当前的li 
		//create indent for menu item 
		$indent = ($depth) ? str_repeat("\t", $depth) : '';

		$li_attributes = '';
		//class name of a menu item 
		$class_names = $values = '';

		//to check if the menu item has class assign the value as array 
		//如果item没有class 初始化为空数组 如果有class  添加到数组 初始化li的class  
		$classes = empty($item->classes) ? array() : (array) $item->classes;
		//start assign the class value to the menu item that contains the sub menu 
		//如果有子级菜单的li 也就是用$args->walker->has_children判断  添加class dropdown 到li 
		//二级菜单li的class 
		$classes[] = ($args->walker->has_children) ? 'dropdown' : ''; 
		//add active when user cilick the menu or click the submenu of the menu 添加active class到当前菜单 如果是当前菜单或者是当前菜单的子菜单

		$classes[] = ($item->current || $item->current_item_ancestor) ? 'active' : '';
		//添加li的id class 
		$classes[] = 'menu-item-' . $item->ID;

		//如果submenu has submenu 也就是menu来到了2,也就是第3层 
		//如果depth是1级1级还包含has_children  三级菜单li的class
		if($depth && $args->walker->has_children) {
			//添加子级的子级li class 
			$classes[] = 'dropdown-submenu'; 
		}

		//apply the filter by joining the array 添加wp默认钩子和class 
		$class_names = join(' ', apply_filters('nav_menu_css_class', array_filter($classes), $item, $args));

		$class_names = 'class="' . esc_attr($class_names) . '"';

		//menu的id跟class一样的过滤钩子
		$id = apply_filters('nav_menu_item_id', 'menu-item-' . $item->ID, $item, $args);

		//clean up the menu id
		$id = 'id="' . esc_attr($id) . '"'; 

		//如果在子级，也就是菜单层级>0, li是以p输出 这个是三级输出
		if($depth > 0) {
			//当第二级菜单形式的时候可以设置输出的li的形式改为p或者其他
			$output .= $indent . '<p ' . $id . $values . $class_names . $li_attributes . '>';
		} else {
			//output the open element 打印li  用扩展符 不用赋值符  来覆盖html 结构 
		$output .= $indent . '<li ' . $id . $values . $class_names . $li_attributes . '>';
		}

		//a链接属性
		//edit the link of the nav menu item 设置 li下面a链接的属性 ，父级
		//所有属性都继承自父级的class 
		$attributes = !empty($item->attr_title) ? 'title="'. $item->attr_title.'"' : '';
		$attributes .= !empty($item->target) ? 'target="' .$item->target. '"' : '';
		//xfn = link relationship 
		$attributes .= !empty($item->xfn) ? 'rel="' .$item->xfn . '"' : ''; 

		$attributes .= !empty($item->url) ? 'href="' . $item->url . '"' : '';

		//if menu item has sub menu add class=dropdown-toggle 
		$attributes .= ($args->walker->has_children) ? 'class="dropwodn-toggle" data-toggle="dropdown"' : '';

		//initialize the menu items 
		$menuitems = $args->before;
		$menuitems .= '<a ' .$attributes . '>';
		$menuitems .= $args->before_link . apply_filters('the_title',$item->title,$item->ID) . $args->after_link;

		//adds span after the a link 在有子级的a后面添加span 符号 
		//$menuitems .= ($depth == 0 && $args->walker->has_children) ? '<span class="caret"></span></a>' : '</a>';
		$menuitems .= '</a>';

		$menuitems .= $args->after;

		//adds on the output again 
		$output .= apply_filters('walker_nav_menu_start_el',$menuitems,$item,$depth,$args); 
	}


	//end el 
	function end_el(&$output, $item, $depth = 0, $args = NULL) {

			if ( isset( $args->item_spacing ) && 'discard' === $args->item_spacing ) {
		$t = '';
		$n = '';
	} else {
		$t = "\t";
		$n = "\n";
	}
	if($depth > 0) {
		$output .= "</p>{$n}";

	} else {
		$output .= "</li>{$n}";

	}

	}
	//end el 函数在</li>结束之前执行， 
	//if theer is no sub menu item wordpress will call end_el function and then generate close li 
	//如果没有子级菜单的话li会执行end_el函数然后结束他 
	//it repeat the process until there is no sub menu it will call end_lvl function to end the ul of the menu
	//当有li带子级菜单的时候重新执行start_lvl 然后执行1级的深度菜单 然后重新生成 start_el 然后关闭end_lvl 

	function end_lvl(&$output, $depth = 0, $args = NULL) {
		if ( isset( $args->item_spacing ) && 'discard' === $args->item_spacing ) {
		$t = '';
		$n = '';
	} else {
		$t = "\t";
		$n = "\n";
	}
	$indent  = str_repeat( $t, $depth );
	$output .= "$indent</ul>{$n}";

		}
 }